<template>
  <div id="myactionbar">
    <van-action-bar>
      <van-action-bar-icon icon="chat-o" text="客服" dot />
      <van-action-bar-icon
        icon="cart-o"
        to="/cart"
        text="购物车"
        :badge="totalcount"
      />
      <van-action-bar-icon icon="star" text="已收藏" color="#ff5000" />
      <van-action-bar-button
        type="warning"
        text="加入购物车"
        @click="onClickCart"
      />
      <van-action-bar-button type="danger" text="立即购买" />
    </van-action-bar>
  </div>
</template>

<script>
import { getHomeGoods } from "@/network/home.js";

export default {
  name: "MyActionBar",
  components: {},
  data() {
    return {
      count: 1,
      goodCart: {},
      totalcount: JSON.parse(sessionStorage.getItem("currentUser")).cartList
        .length,
    };
  },
  props: {
    goodsId: String,
  },
  methods: {
    onClickCart() {
      //封装购物车参数payload
      getHomeGoods().then((res) => {
        this.goodCart = res.filter((item) => item.goodsId === this.goodsId)[0];
        this.goodCart.num = this.count;
        this.$emit("onClickCart", this.goodCart);
        this.totalcount++;
      });
    },
  },
};
</script>

<style scoped>
#myactionbar .van-action-bar {
  z-index: 1;
}
</style>
